<template>
  <view>
    <form @reset="formReset" @submit="formSubmit">
      <view class="container1">
        <view class="head">
          <view @tap="choose" class="left">
            <image class="img" mode="aspectFill" :src="logo"></image>
          </view>
          <view class="right">
            <view class="weui-cell weui-cell_input">
              <view class="weui-cell__hd">
                <view class="weui-label">商品排序：</view>
              </view>
              <view class="weui-cell__bd">
                <input
                  class="weui-input"
                  name="sppx"
                  placeholder="从小到大排序"
                  type="number"
                  :value="sppx"
                />
              </view>
            </view>
            <view class="weui-cell weui-cell_input">
              <view class="weui-cell__hd">
                <view class="weui-label">商品名称：</view>
              </view>
              <view class="weui-cell__bd">
                <input
                  class="weui-input"
                  name="spmc"
                  placeholder="输入商品名称"
                  :value="spmc"
                />
              </view>
            </view>
          </view>
        </view>
        <view class="main">
          <view class="bd">
            <view class="left">商品分类：</view>
            <view class="right">
              <view class="weui-cell weui-cell_input">
                <view class="weui-cell__bd">
                  <picker
                    @change="spflChange"
                    :range="spfl"
                    rangeKey="type_name"
                    :value="spflIndex"
                  >
                    <view class="weui-select" style="border-right: none">{{
                      spfl[spflIndex].type_name
                    }}</view>
                  </picker>
                </view>
              </view>
            </view>
          </view>
          <view class="bd">
            <view class="left">商品类型：</view>
            <view class="right">
              <view class="weui-cell weui-cell_input" style="border: none">
                <view class="weui-cell__bd">
                  <picker @change="spxxChange" :range="spxx" :value="spxxIndex">
                    <view class="weui-select" style="border-right: none">{{
                      spxx[spxxIndex]
                    }}</view>
                  </picker>
                </view>
              </view>
            </view>
          </view>
        </view>
        <view class="main">
          <view class="kcsl">
            <view class="bd">
              <view class="left">商品库存：</view>
              <view class="right">
                <view class="weui-cell weui-cell_input">
                  <view class="weui-cell__bd">
                    <input
                      class="weui-input"
                      name="cpkc"
                      type="number"
                      :value="cpkc"
                    />
                  </view>
                </view>
              </view>
            </view>
            <view class="bd">
              <view class="left">商品销量：</view>
              <view class="right">
                <view class="weui-cell weui-cell_input">
                  <view class="weui-cell__bd">
                    <input
                      class="weui-input"
                      name="yxsl"
                      type="number"
                      :value="yxsl"
                    />
                  </view>
                </view>
              </view>
            </view>
          </view>
          <view class="kcsl">
            <view class="bd">
              <view class="left">外卖价格：</view>
              <view class="right">
                <view class="weui-cell weui-cell_input">
                  <view class="weui-cell__bd">
                    <input
                      class="weui-input"
                      name="wmjg"
                      type="digit"
                      :value="wmjg"
                    />
                  </view>
                  <view class="weui-cell__ft">元</view>
                </view>
              </view>
            </view>
            <view class="bd">
              <view class="left">原价：</view>
              <view class="right">
                <view class="weui-cell weui-cell_input">
                  <view class="weui-cell__bd">
                    <input
                      class="weui-input"
                      name="yj"
                      type="digit"
                      :value="yj"
                    />
                  </view>
                  <view class="weui-cell__ft">元</view>
                </view>
              </view>
            </view>
          </view>
          <view class="kcsl">
            <view class="bd">
              <view class="left">店内价格：</view>
              <view class="right">
                <view class="weui-cell weui-cell_input">
                  <view class="weui-cell__bd">
                    <input
                      class="weui-input"
                      name="dnjg"
                      type="digit"
                      :value="dnjg"
                    />
                  </view>
                  <view class="weui-cell__ft">元</view>
                </view>
              </view>
            </view>
            <view class="bd">
              <view class="left">包装费用：</view>
              <view class="right">
                <view class="weui-cell weui-cell_input">
                  <view class="weui-cell__bd">
                    <input
                      class="weui-input"
                      name="bzfy"
                      type="digit"
                      :value="bzfy"
                    />
                  </view>
                  <view class="weui-cell__ft">元</view>
                </view>
              </view>
            </view>
          </view>
          <view class="kcsl">
            <view class="bd">
              <view class="left">限购份数：</view>
              <view class="right">
                <view class="weui-cell weui-cell_input">
                  <view class="weui-cell__bd">
                    <input
                      class="weui-input"
                      name="xgfs"
                      type="number"
                      :value="xgfs"
                    />
                  </view>
                </view>
              </view>
            </view>
            <view class="bd">
              <view class="left">起售份数：</view>
              <view class="right">
                <view class="weui-cell weui-cell_input">
                  <view class="weui-cell__bd">
                    <input
                      class="weui-input"
                      name="qsfs"
                      type="number"
                      :value="qsfs"
                    />
                  </view>
                </view>
              </view>
            </view>
          </view>
          <view class="bd">
            <view class="left">商品简介：</view>
            <view class="right">
              <view
                class="weui-cell weui-cell_input"
                style="border: none; padding: 10px 10px"
              >
                <view class="weui-cell__bd">
                  <input
                    class="weui-input"
                    name="spjj"
                    placeholder="请输入商品简介"
                    :value="spjj"
                  />
                </view>
              </view>
            </view>
          </view>
        </view>
        <view class="main">
          <view class="bd">
            <view class="left">商品状态：</view>
            <view class="right">
              <view class="weui-cell weui-cell_switch">
                <view class="weui-cell__bd" style="padding-left: 15px">{{
                  sjxj[sjxjIndex]
                }}</view>
                <view class="weui-cell__ft">
                  <switch
                    @change="switchChange"
                    :checked="sjxjIndex == 0"
                  ></switch>
                </view>
              </view>
            </view>
          </view>
          <view class="bd">
            <view class="left">商品属性：</view>
            <view class="right">
              <checkbox-group @change="checkboxChange" class="spsx">
                <label
                  class="weui-cell weui-check__label"
                  style="border: none"
                  v-for="(item, index) in checkboxItems"
                  :key="item.value"
                >
                  <checkbox
                    :checked="item.checked"
                    class="weui-check"
                    :value="item.value"
                  ></checkbox>

                  <view class="weui-cell__hd weui-check__hd_in-checkbox">
                    <icon
                      class="weui-icon-checkbox_circle"
                      size="23"
                      type="circle"
                      v-if="!item.checked"
                    ></icon>
                    <icon
                      class="weui-icon-checkbox_success"
                      size="23"
                      type="success"
                      v-if="item.checked"
                    ></icon>
                  </view>

                  <view class="weui-cell__bd">{{ item.name }}</view>
                </label>
              </checkbox-group>
            </view>
          </view>
        </view>
        <view class="button">
          <button
            class="weui-btn"
            :disabled="disabled"
            formType="submit"
            :style="'background:' + color"
            type="primary"
            v-if="!isbj"
          >
            添加商品
          </button>
          <button
            class="weui-btn"
            :disabled="disabled"
            formType="submit"
            :style="'background:' + color"
            type="primary"
            v-if="isbj"
          >
            重新提交
          </button>
        </view>
      </view>
    </form>
  </view>
</template>

<script>
import cardlist from '@/ymq_canyino2o/dist/cardlist/index'
import gettel from '@/ymq_canyino2o/dist/gettel/index'
var app = getApp()
var util = require('../../../utils/util.js')
var siteinfo = require('../../../../siteinfo.js');
export default {
  components: {
    cardlist,
    gettel
  },
  data() {
    return {
      isbj: false,
      url1: '',
      logo: 'https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/splogo.png',
      spfl: [],
      spflIndex: 0,
      spxx: ['外卖', '店内', '店内+外卖'],

      checkboxItems: [
        {
          name: '热销',
          value: '0'
        },
        {
          name: '推荐',
          value: '1'
        },
        {
          name: '新品',
          value: '2'
        },
        {
          name: '招牌',
          value: '3'
        }
      ],

      spxxIndex: 0,
      sjxj: ['上架', '下架'],
      sjxjIndex: 0,
      disabled: false,
      sppx: '',
      spmc: '',
      cpkc: '',
      yxsl: '',
      dnjg: '',
      wmjg: '',
      bzfy: '',
      cpid: '',
      splogo: '',
      yj: '',
      xgfs: '',
      qsfs: '',
      spjj: '',
      type_name: '',
      color: ''
    }
  },
  onLoad: function (e) {
    app.globalData.setNavigationBarColor(this)
    console.log(e, this.cpid)
    if (null != e.cpid) {
      this.setData({
        cpid: e.cpid,
        isbj: true
      })
      app.globalData.util.request({
        url: 'entry/wxapp/StoreDishesInfo',
        cachetime: '0',
        data: {
          id: e.cpid
        },
        success: function (t) {
          console.log('菜品信息', t)
          var e = that.checkboxItems
          if ('1' == t.data.is_hot) {
            e[0].checked = true
          }
          if ('1' == t.data.is_tj) {
            e[1].checked = true
          }
          if ('1' == t.data.is_new) {
            e[2].checked = true
          }
          if ('1' == t.data.is_zp) {
            e[3].checked = true
          }
          var a = uni.getStorageSync('sjdsjid')
          app.globalData.util.request({
            url: 'entry/wxapp/GoodsType',
            cachetime: '0',
            data: {
              store_id: a
            },
            success: function (e) {
              console.log(e)
              e.data
              for (var a = 0; a < e.data.length; a++) {
                if (e.data[a].id == t.data.type_id) {
                  that.setData({
                    spflIndex: a
                  })
                }
              }
            }
          })
          that.setData({
            logo: t.data.logo,
            splogo: t.data.logo,
            sppx: t.data.num,
            spmc: t.data.name,
            cpkc: t.data.inventory,
            yxsl: t.data.sales,
            dnjg: t.data.dn_money,
            wmjg: t.data.money,
            yj: t.data.money2,
            bzfy: t.data.box_money,
            xgfs: t.data.restrict_num,
            qsfs: t.data.start_num,
            spjj: t.data.content,
            sjxjIndex: Number(t.data.is_show) - 1,
            spxxIndex: Number(t.data.type) - 1,
            checkboxItems: e
          })
        }
      })
    }
    var a = uni.getStorageSync('sjdsjid')
    console.log(a)
    var that = this
    app.globalData.util.request({
      url: 'entry/wxapp/GoodsType',
      cachetime: '0',
      data: {
        store_id: a
      },
      success: function (e) {
        console.log(e)
        that.setData({
          spfl: e.data
        })
      }
    })
  },
  onReady: function () {},
  onShow: function () {},
  onHide: function () {},
  onUnload: function () {},
  onPullDownRefresh: function () {},
  onReachBottom: function () {},
  methods: {
    spflChange: function (e) {
      console.log(
        'spflChange 发生选择改变，携带值为',
        e.detail.value,
        this.spfl[e.detail.value].id
      )
      this.setData({
        spflIndex: e.detail.value
      })
    },

    spxxChange: function (e) {
      console.log(
        'spxxChange 发生选择改变，携带值为',
        e.detail.value,
        this.spxx[e.detail.value]
      )
      this.setData({
        spxxIndex: e.detail.value
      })
    },

    switchChange: function (e) {
      console.log('switchChange 发生选择改变，携带值为', e.detail.value)
      this.setData({
        sjxjIndex: e.detail.value ? 0 : 1
      })
    },

    checkboxChange: function (e) {
      console.log('checkbox发生change事件，携带value值为：', e.detail.value)
      this.$forceUpdate()
      for (
        var a = this.checkboxItems, t = e.detail.value, s = 0, o = a.length;
        s < o;
        ++s
      ) {
        a[s].checked = false
        for (var i = 0, n = t.length; i < n; ++i) {
          if (a[s].value == t[i]) {
            a[s].checked = true
            break
          }
        }
      }
      console.log(a)
      this.setData({
        checkboxItems: a
      })
    },

    choose: function (e) {
      var that = this
      console.log(siteinfo)
      uni.chooseImage({
        count: 1,
        sizeType: ['compressed'],
        sourceType: ['album', 'camera'],
        success: function (e) {
          console.log(e.tempFilePaths)
          var a = e.tempFilePaths
          uni.showToast({
            icon: 'loading',
            title: '正在上传'
          })
          uni.uploadFile({
            url:
              siteinfo.siteroot +
              '?i=' +
              siteinfo.uniacid +
              '&c=entry&a=wxapp&do=upload&m=ymq_canyino2o',
            filePath: e.tempFilePaths[0],
            name: 'upfile',
            success: function (e) {
              console.log(e)
              that.setData({
                splogo: e.data
              })
              if (200 == e.statusCode) {
                that.setData({
                  url1: '',
                  logo: a
                })
              } else {
                uni.showModal({
                  title: '提示',
                  content: '上传失败',
                  showCancel: false
                })
              }
            },
            fail: function (e) {
              console.log(e)
              uni.showModal({
                title: '提示',
                content: '上传失败',
                showCancel: false
              })
            },
            complete: function () {
              uni.hideToast()
            }
          })
        }
      })
    },

    formSubmit: function (e) {
      console.log('form发生了submit事件，携带数据为：', e.detail.value)
      var that = this
      var t = this.cpid
      var s = this.checkboxItems
      var o = s[0].checked ? 1 : 2
      var i = s[1].checked ? 1 : 2
      var n = s[2].checked ? 1 : 2
      var l = s[3].checked ? 1 : 2
      var d = uni.getStorageSync('sjdsjid')
      var c = e.detail.value.sppx
      var u = e.detail.value.spmc
      var p = e.detail.value.cpkc
      var h = e.detail.value.yxsl
      var x = e.detail.value.dnjg
      var r = e.detail.value.yj
      var g = e.detail.value.wmjg
      var m = e.detail.value.bzfy
      var f = e.detail.value.xgfs
      var v = e.detail.value.qsfs
      var w = e.detail.value.spjj
      var j = this.splogo
      var y = this.spfl[this.spflIndex].id
      var b = Number(this.spxxIndex) + 1
      var _ = Number(this.sjxjIndex) + 1
      console.log(t, d, c, u, p, h, x, r, g, m, f, v, w, j, y, b, _, o, i, n, l)
      var k = ''
      var I = true
      if (null == j) {
        k = '请上传商品图片！'
      } else {
        if ('' == u) {
          k = '请填写商品名称！'
        } else {
          if ('' == p) {
            k = '请填写商品库存！'
          } else {
            if ('' == x) {
              k = '请填写商品店内价格！'
            } else {
              if ('' == g) {
                k = '请填写商品外卖价格！'
              } else {
                that.setData({
                  disabled: true
                })
                I = false
                app.globalData.util.request({
                  url: 'entry/wxapp/AddStoreDishes',
                  cachetime: '0',
                  data: {
                    store_id: d,
                    id: t,
                    num: c,
                    name: u,
                    type_id: y,
                    type: b,
                    inventory: p,
                    sales: h,
                    money: g,
                    money2: r,
                    dn_money: x,
                    box_money: m,
                    restrict_num: f,
                    start_num: v,
                    content: w,
                    logo: j,
                    is_show: _,
                    is_hot: o,
                    is_tj: i,
                    is_new: n,
                    is_zp: l
                  },
                  success: function (e) {
                    console.log(e)
                    if (1 == e.data) {
                      uni.showToast({
                        title: '提交成功'
                      })
                      setTimeout(function () {
                        uni.navigateBack({})
                      }, 1000)
                    } else {
                      that.setData({
                        disabled: false
                      })
                      uni.showToast({
                        title: '请修改后提交！',
                        icon: 'loading'
                      })
                    }
                  }
                })
              }
            }
          }
        }
      }
      if (1 == I) {
        uni.showModal({
          title: '提示',
          content: k
        })
      }
    },

    formReset() {
      console.log('占位：函数 formReset 未声明')
    }
  }
}
</script>
<style>
@import './bjcp.css';
</style>
